<template>
  <view class="content">
    <view class="section-1">
      <view class="section-body">
        <view class="list">
          <view class="item">
            <view class="title">
              <text>被省公司纳入“负面清单”外包单位</text>
            </view>
            <view
              class="inlineItem"
              v-for="(item2, index) in list"
              :key="index"
            >
              <view class="company"
                >单位名称：<span class="inline">{{ item2.company }}</span></view
              >
              <view class="time"
                >禁入时间：<span class="inline">{{ item2.time }}</span></view
              >
            </view>
          </view>
          <view class="item">
            <view class="title">
              <text>被国网公司纳入“黑名单”的外包单位</text>
            </view>
            <view
              class="inlineItem"
              v-for="(item3, index) in tabList"
              :key="index"
            >
              <view class="company"
                >所属单位：<span class="inline">{{ item3.company }}</span></view
              >
              <view class="time"
                >禁入时间：<span class="inline">{{ item3.time }}</span></view
              >
            </view>
          </view>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
import { progressListApi } from "@/api/statistics.js";
import { mapGetters } from "vuex";

export default {
  data() {
    return {
      mescroll: null, // mescroll实例对象 (此行可删,mixins已默认)
      upOption: {
        textNoMore: "-- 没有更多了 --",
      },
      pageSize: 20,
      list: [
        {
          company: "徐州中源工程安装有限公司",
          time: "2022-02-28至2023-02-27",
        },
        {
          company: "江苏峻越建设有限公司（原江苏立威建筑工程有限公司）",
          time: "2022-02-28至2023-02-27",
        },
		{
		  company: "无锡市广石电力安装有限公司",
		  time: "2022-05-23至2023-05-22",
		},
      ],
      id: 0,
      point1: 0,
      point2: 0,
      tabList: [
		{
		  company: "四川省岳池市石垭建安有限公司",
		  time: "2022-05-04至2024-05-03",
		},
      ],
      curIdx: 0,
      curName: "检查扣分",
    };
  },
  onLoad(data) {
    this.id = data.id;
    this.point1 = data.point1;
    this.point2 = data.point2;
    this.data = this.getTempData;
  },
  computed: {
    ...mapGetters({ getTempData: "system/getTempData" }),
  },
  methods: {
    setCurIdx(idx, name) {
      this.curIdx = idx;
      this.curName = name;
      uni.showLoading({
        title: "加载中。。。",
      });
      setTimeout(() => {
        uni.hideLoading();
      }, 500);
      this.mescroll.resetUpScroll();
      this.mescroll.scrollTo(0, 0);
    },
    handleResetForm() {
      for (let key in this.form) {
        this.form[key] = "";
      }
      this.mescroll.resetUpScroll();
      this.mescroll.scrollTo(0, 0);
    },
    handleSearch() {
      this.mescroll.resetUpScroll();
      this.mescroll.scrollTo(0, 0);
    },
    mescrollInit(mescroll) {
      this.mescroll = mescroll;
    },
    async upCallback(page) {
      const { data } = await progressListApi({
        // project_id: this.id,
        project_id: "3ad4ed48-9140-48c2-a3e8-a320da6867f9",
        page: page.num,
        pageSize: this.pageSize,
      });

      if (data.code === 1 || data.code === 200) {
        // 接口返回的当前页数据列表 (数组)
        let curPageData = data.data;
        // 接口返回的当前页数据长度 (如列表有26个数据,当前页返回8个,则curPageLen=8)
        let curPageLen = curPageData.length;
        // 接口返回的总页数 (如列表有26个数据,每页10条,共3页; 则totalPage=3)
        let totalPage = data.data.last_page;
        //设置列表数据
        if (page.num == 1) this.list = []; //如果是第一页需手动置空列表

        this.list = this.list.concat(curPageData); //追加新数据
        // 请求成功,隐藏加载状态
        this.mescroll.endByPage(curPageLen, totalPage);
        setTimeout(() => {
          // this.mescroll.endSuccess(curPageLen);
          this.mescroll.endSuccess(1);
        }, 20);
      } else {
        //  请求失败,隐藏加载状态
        this.mescroll.endErr();
      }
    },
  },
};
</script>

<style lang="scss" scoped>
.section-1 {
  width: 100%;
  background: #2e5efe;
  .section-body {
    width: 100%;
    height: 100%;
    border-top-left-radius: 50rpx;
    border-top-right-radius: 50rpx;
    background-color: #fff;
    overflow: hidden;
    .list {
      width: 100%;
      box-sizing: border-box;
      padding: 0 35rpx;
      padding-top: 40rpx;
      .item {
        width: 100%;
        border-radius: 30rpx;
        @include common-box-shadow;
        margin-bottom: 40rpx;
        box-sizing: border-box;
        padding: 30rpx 20rpx;
        .title {
          margin-left: 15.3rpx;
          font-size: 34.5rpx;
          font-weight: bolder;
          color: #2e5eff;
        }
        .inlineItem {
          background-color: #efefef;
          border-radius: 25rpx;
          padding-left: 29rpx;
          margin-top: 29rpx;
          font-size: 26.8rpx;
          .company {
            padding-top: 23rpx;
            padding-bottom: 8.4rpx;
          }
          .time {
              padding-bottom: 21rpx;
          }
          .inline {
            color: #888388;
          }
        }
        .mid {
          margin-bottom: 20rpx;
          .label {
            @include font-normal;
            margin-bottom: 10rpx;
          }
          .textarea-body {
            box-sizing: border-box;
            width: 100%;
            height: 200rpx;
            border: none;
            padding: 15rpx !important;
            font-weight: normal;
            font-stretch: normal;
            letter-spacing: 0rpx;
            font-size: 25rpx;
            border-radius: 15rpx;
            background-color: #ededed;
            color: #3b3c40;
            overflow-y: scroll;
          }
        }
        .bottom {
          width: 100%;
          font-size: 18rpx;
          color: #3b3c40;
          .left {
            width: 100%;
            margin-bottom: 10rpx;
          }
          .right {
            width: 100%;
          }
        }
      }
    }
  }
}
</style>
